<template>
  <el-dialog
    v-loading="loadding"
    title="新建"
    :fullscreen="true"
    :visible.sync="visible"
    :modal="false"
    custom-class="fielDialog"
    @close="$emit('change', false)"
  >
    <iframe
      v-if="isPdf"
      ref="fileIframe"
      :src="`${host}/pdf/web/viewer.html?file=${fileUrl}`"
      frameborder="0"
    />
    <iframe
      v-else
      ref="fileIframe"
      class="iframe_box"
      :src="fileUrl"
      frameborder="0"
    />
  </el-dialog>
</template>

<script>
import { getToken } from '@/utils/auth'
export default {
  model: {
    prop: 'show',
    event: 'change'
  },
  props: {
    show: {
      type: Boolean,
      default: false
    },
    url: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      visible: false,
      loadding: false
    }
  },

  computed: {
    isPdf() {
      return this.url.includes('.pdf')
    },
    fileUrl() {
      return this.url + '?date=' + new Date().getTime()
    },
    fileName() {
      return this.fileUrl.slice(this.fileUrl.lastIndexOf('/') + 1)
    }
  },

  watch: {
    show: {
      handler(val) {
        this.visible = val
      },
      immediate: true
    }
  }

}
</script>
<style lang="scss" scoped>
// .iframe_box{
//   width: 100%;
//   min-height: calc(100vh - 146px);
// }
// .img_box{
//   width: calc(100vw - 342px);
//   height: calc(100vh - 126px);
//   overflow: auto;
// }

</style>
